<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="js/jquery-2.1.0.js"></script>
    <link rel="stylesheet" href="css/normalize.css" />
    <link rel="stylesheet" href="{{asset('css/inform.css')}}" />
</head>

<body>
    <div class="z-infor-box">
        <!--头部的代码-->
        <nav class="fixed">
            <div class="center">
                <div class="nav-brand left">
                </div>
                <ul class="nav-left left">
                    <li><button><a href="http://test.cn">首页</a href=""></button></li>
                    <li><button><a href="http://test.cn/ranking">排行榜</a></button></li>
                    <li><button><a>消息</a></button></li>
                </ul>
                <div class="nav-form left">
                    <input type="text" placeholder="搜索文章" @keyup="keydown($event)">
                    <span class="search" @click="bigsearch"></span>
                </div>
                <ul class="nav-right right">
                    <li>
                        <a class="writing" href="#">写文章</a>
                    </li>
                    <li>
                        <a class="person dropdown" href="#">@{{user_name}}</a>
                        <!-- 下拉菜单 -->
                        <ul class="drop-menu">
                            <li>
                                <a href="http://test.cn/setting">用户中心</a>
                            </li>
                            <li>
                                <a href="http://test.cn/login">注销</a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </div>
        </nav>

        
        <!--头部代码结束-->
        <!--主体内容-->
        <div class="infor-content">
            <div class="infor-left">
                <div class="left-img">
                </div>
                <ul class="fun-list">
                    <li class="li-focus modify-kackground" @click="js_focus(0,$event)"><img src="images//like.png" />收到的赞</li>
                    <li class="li-jifen" @click="js_focus(1,$event)"><img src="images//change.png" />积分变动</li>
                    <li class="li-wenzhang" @click="js_focus(2,$event)"><img src="images//page.png" />文章审核</li>
                    <li class="li-fankui" @click="js_focus(3,$event)"><img src="images//fankui.png" />反馈管理</li>
                </ul>
            </div>
            <div class="infor-right">
                <div class="right-top">消息中心</div>
                <div class="right-bottom">
                    <div class="bottom-top">
                        <span class="all-read read-change" @click="show_allRead">全部 (<span class="gain-one">@{{allRead}}</span>)</span>
                        <span class="no-read" @click="show_noRead">未读 (
                            <span class="gain-two">@{{noneRead}}</span>
                            )</span>
                    </div>
                    <!-- 数据渲染 -->
                    <div class="bottom-bottom  b-one">
                        <ul class="js-list">
                            <li class="list" v-for="(item,index) of list_data">
                                <span class="who">@{{item.message}}</span>
                                <span class="time">@{{slice_time("1029-92-12 00:00:00")}}</span>
                                <span class="drop-list" :class="is_feedbacak(item.feedbcak)" @click="show_feedbcak($event)">查看详情</span>
                                <div class="like-page">
                                    <span>@{{item.articletitle}}</span>
                                    <button class="js-wd weidu-btn" :class="is_read(item.readstatus)" type="button" @click="chage_status($event,item)">
                                        @{{item.readstatus==0?"未读":"已读"}}
                                    </button>
                                </div>
                                <div class="feedbcak-content">@{{item.feedbcak}}<span>请修改</span></div>
                            </li>
                        </ul>
                    </div>
                </div>
                <!-- 分页 -->
                <ul class="paging">
                    <li class="init-page">
                        <button type="button" @click="init">首页</button></li>
                    <li class="pre-page">
                        <button class="pre-btn" type="button" @click="pre">上一页</button></li>
                    <li class="current-page">@{{current_page}}</li>
                    <li class="next-page">
                        <button class="next-btn" type="button" @click="next">下一页</button></li>
                    <li class="end-page">
                        <button type="button" @click="end">尾页</button></li>
                    <li class="num-page">
                        <input id="jump-btn" type="text" value="0">
                    </li>
                    <li class="jump">
                        <button type="button" @click="jump">跳转</button></li>
                    <li class="total-page">一共有@{{per_page}}页</li>
                </ul>
            </div>
        </div>
        <!-- 数据渲染 -->
        <script src="{{asset('js/vue.js')}}"></script>
        <script type="text/javascript" src="{{asset('js/info.js')}}"></script>
</body>

</html>